{include file="public/layout" /}
<style>
    .orderinfo{ width:100%;margin-top:5px;padding: 5px;background: #FFF;}
    .orderinfo .item{display:flex;width:100%;padding:10px 0;border-bottom:1px dashed #ededed;overflow:hidden}
    .orderinfo .item:last-child{ border-bottom: 0;}
    .orderinfo .item .t1{width:100px;flex-shrink:0}
    .orderinfo .item .t2{flex:1;text-align:right;}
    .orderinfo .item .red{color:red}
</style>
<body class="laytp-container">
<div class="layui-card" id="search-form">
    <div class="layui-card-body">
        <form class="layui-form layui-row layui-col-space16 layui-search-admin">
        <div class="layui-inline">
            <label class="layui-form-label">会员ID</label>
            <div class="layui-input-inline">
                <input type="text" name="user_id" value="" placeholder="会员ID" class="layui-input" lay-affix="clear">
            </div>
        </div>
        <div class="layui-inline">
            <label class="layui-form-label">会员编号</label>
            <div class="layui-input-inline">
                <input type="text" name="username" placeholder="会员编号" lay-affix="clear" class="layui-input">
            </div>
        </div>
        <div class="layui-inline">
            <label class="layui-form-label">订单编号</label>
            <div class="layui-input-inline">
                <input type="text" name="order_sn" placeholder="订单编号" lay-affix="clear" class="layui-input">
            </div>
        </div>
        <div class="layui-inline">
            <label class="layui-form-label" style="width: 100px;">订单状态</label>
            <div class="layui-input-inline">
                <select name="order_status">
                    <option value="all">订单状态</option>
                    {foreach $order_status as $status_K=>$status_str}
                        <option value="{$status_K}">{$status_str}</option>
                    {/foreach}
                </select>
            </div>
        </div>
        {if $sid==0}
        <div class="layui-inline">
            <label class="layui-form-label" style="width: 100px;">订单类型</label>
            <div class="layui-input-inline">
                <select name="leixing_id">
                    <option value="all">订单类型</option>
                    {foreach $goods_leixing as $leixing_id=>$leixing_name}
                        <option value="{$leixing_id}">{$leixing_name}</option>
                    {/foreach}
                </select>
            </div>
        </div>
        {/if}
        <div class="layui-inline">
            <label class="layui-form-label">下单时间</label>
            <div class="layui-inline" id="laydate-rangeLinked">
                <div class="layui-input-inline">
                    <input type="text" name="time_start" autocomplete="off" id="table-search-date-start" class="layui-input" placeholder="开始日期">
                </div>-
                <div class="layui-input-inline">
                    <input type="text" name="time_end" autocomplete="off" id="table-search-date-end" class="layui-input" placeholder="结束日期">
                </div>
            </div>
        </div>
        <div class="layui-inline">
            <label class="layui-form-label">商家信息</label>
            <div class="layui-input-inline">
                <input type="text" name="s_username" placeholder="商家账号/商家名称" lay-affix="clear" class="layui-input">
            </div>
        </div>
        <div class="layui-inline">
            <label class="layui-form-label"></label>
            <button class="layui-btn" lay-submit lay-filter="demo-table-search">搜索</button>
            <button type="reset" class="layui-btn layui-btn-primary">清空</button>
        </div>
    </form>
    </div>
</div>
<div class="layui-card">
    <div class="layui-card-body">
        <table id="tabledata" lay-filter="tabledata"></table>
    </div>
</div>
<div id="audit_model" style="display: none;padding-top: 20px;">
    <div class="layui-form" lay-filter="">
        <div class="layui-form-item">
            <label class="layui-form-label" >审核状态</label>
            <div class="layui-input-inline layui-input-wrap">
                <select name="audit_status" id="audit_status">
                    <option value="1">审核通过</option>
                    <option value="2">审核拒绝</option>
                </select>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">备注</label>
            <div class="layui-input-inline layui-input-wrap">
                <input type="text" id="audit_remark" name="remark" placeholder="请输入备注" value="" autocomplete="off" class="layui-input">
            </div>
        </div>
    </div>
</div>
<div id="send_model" style="display: none;padding-top: 20px;">
    <div class="layui-form" lay-filter="formSendOrder">
        <div class="layui-form-item">
            <label class="layui-form-label" >物流公司</label>
            <div class="layui-input-inline layui-input-wrap">
                <select name="shipping_code" id="shipping_code">
                    {foreach $shipping_list as $shipping}
                    <option value="{$shipping['shipping_code']}">{$shipping['shipping_name']}</option>
                    {/foreach}
                </select>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">物流单号</label>
            <div class="layui-input-inline layui-input-wrap">
                <input type="text" id="delivery_no" name="delivery_no" placeholder="请输入物流单号" value="" autocomplete="off" class="layui-input">
            </div>
        </div>
<!--        <div class="layui-form-item">-->
<!--            <div class="layui-input-block">-->
<!--                <button class="layui-btn layui-btn-normal" lay-submit lay-filter="formSendOrder">确认发货</button>-->
<!--            </div>-->
<!--        </div>-->
    </div>
</div>
<div id="ps_model" style="display: none;padding-top: 20px;">
    <div class="layui-form" lay-filter="formSendOrder">
        <div class="layui-form-item">
            <label class="layui-form-label">配送员</label>
            <div class="layui-input-inline layui-input-wrap" style="width: 120px;">
                <input type="text" id="ps_id" name="ps_id" placeholder="配送员ID" value="" autocomplete="off" class="layui-input">
            </div>
            <div class="layui-form-mid" id="ps_name"></div>
            <button type="button" class="layui-btn layui-btn-primary" onclick="showChoosPsUser()">选择配送员</button>
        </div>
        <div class="layui-form-item">

        </div>
    </div>
</div>
<script type="text/html" id="toolbar">
    <div class="layui-btn-container">
        <button class="layui-btn layui-btn-sm" onclick="reload()">
            刷新数据
        </button>
<!--        <button class="layui-btn layui-btn-sm" onclick="del()">-->
<!--            批量删除-->
<!--        </button>-->
        <button class="layui-btn layui-btn-sm" data-form-export="{:url('excel')}">
            导出数据
        </button>

    </div>
</script>
<script type="text/html" id="handlebar">
    <div class="layui-clear-space">
        <a class="layui-btn layui-btn-xs" lay-event="edit">查看</a>
        <a class="layui-btn layui-btn-xs" lay-event="more">
            更多
            <i class="layui-icon layui-icon-down"></i>
        </a>
    </div>
</script>
<script>
    var tableIns
    var datawhere = {};
    datawhere.status = '{$status}';
    layui.use(function(){
        var table = layui.table;
        var dropdown = layui.dropdown;
        var laydate = layui.laydate;
        var form = layui.form;

        // 创建渲染实例
        tableIns = table.render({
            elem: '#tabledata',
            url:'{:url("index")}', // 此处为静态模拟数据，实际使用时需换成真实接口
            where:datawhere,
            toolbar: '#toolbar',
            defaultToolbar: ['filter'],
            height: 'full-200', // 最大高度减去其他容器已占有的高度差
            css: [ // 重设当前表格样式
                '.layui-table-tool-temp{padding-right: 145px;}'
            ].join(''),
            cellMinWidth: 80,
            totalRow: true, // 开启合计行
            page: true,
            pagebar: '#test-pagebar', // 分页栏模板
            cols: [[
                {type: 'checkbox', fixed: 'left'},
                {field:'order_id', title: '订单ID', sort: true, totalRowText: '合计：'},
                {field:'order_sn', title: '订单编号',totalRowText: ''},
                {field:'user_id', width:80, title: '会员ID',totalRowText: ''},

                {field:'status_str', title:'订单状态'},
                {field:'refund_status_str', title:'退款状态'},
                {field:'reason', title:'退款原因'},
                {field:'remark', title:'备注'},
                {field:'ps_user_id', title:'配送员ID'},
                {field:'w_time', title:'申请时间'},

                {fixed: 'right', title:'操作', width: 134, minWidth: 200, templet:function(d){
                    var html = '';
                    html += '<a class="layui-btn layui-btn-xs" onclick="detail('+d.order_id+')">查看</a>';
                    if(d.status==0){
                        html += '<a class="layui-btn layui-btn-xs" onclick="auditRefund('+d.order_id+')">审核退款</a>';
                    }
                    return html;
                }}
            ]],
            error: function(res, msg){
                console.log(res, msg)
            }
        });

        // 触发单元格工具事件
        table.on('tool(tabledata)', function(obj){ // 双击 toolDouble
            var data = obj.data; // 获得当前行数据
            // console.log(obj)
            if(obj.event === 'edit'){
                layer.open({
                    title: '查看 - id:'+ data.user_id,
                    type: 2,
                    shadeClose: true,
                    area: ['100%','100%'],
                    scrollbar:false,
                    content: '/admin/order/detail/id/'+data.user_id
                });
            } else if(obj.event === 'more'){
                // 更多 - 下拉菜单
                dropdown.render({
                    elem: this, // 触发事件的 DOM 对象
                    show: true, // 外部事件触发即显示
                    data: [{
                        title: '查看',
                        id: 'detail'
                    },{
                        title: '删除',
                        id: 'del'
                    }],
                    click: function(menudata){
                        if(menudata.id === 'detail'){
                            layer.msg('查看操作，当前行 ID:'+ data.id);
                        } else if(menudata.id === 'del'){
                            layer.confirm('真的删除行 [id: '+ data.id +'] 么', function(index){
                                obj.del(); // 删除对应行（tr）的DOM结构
                                layer.close(index);
                                // 向服务端发送删除指令
                            });
                        }
                    },
                    align: 'right', // 右对齐弹出
                    style: 'box-shadow: 1px 1px 10px rgb(0 0 0 / 12%);' // 设置额外样式
                })
            }
        });

        laydate.render({
            elem: '.demo-table-search-date'
        });
        laydate.render({
            elem: '#laydate-rangeLinked',
            type: 'datetime',
            range: ['#table-search-date-start', '#table-search-date-end'],
            rangeLinked: true // 开启日期范围选择时的区间联动标注模式 ---  2.8+ 新增
        });
        // 搜索提交
        form.on('submit(demo-table-search)', function(data){
            var field = data.field; // 获得表单字段
            var olddatawhere = datawhere
            datawhere = field
            datawhere.field = olddatawhere.field
            datawhere.order = olddatawhere.order
            datawhere.status = olddatawhere.status
            // 执行搜索重载
            table.reload('tabledata', {
                page: {
                    curr: 1 // 重新从第 1 页开始
                },
                where: datawhere // 搜索的字段
            });
            //layer.msg('搜索成功<br>此处为静态模拟数据，实际使用时换成真实接口即可');
            return false; // 阻止默认 form 跳转
        });
    });
    function add(){
        layer.open({
            title: '添加',
            type: 2,
            shadeClose: true,
            area: ['100%','100%'],
            scrollbar:false,
            content: '{:url("reg1")}'
        });
    }
    function reload(){
        layui.table.reload('tabledata', {
            where: datawhere,
            // scrollPos: 'fixed',  // 保持滚动条位置不变 - v2.7.3 新增
            // height: 2000, // 测试无效参数（即与数据无关的参数设置无效，此处以 height 设置无效为例）
            //url: '404',
            //page: {curr: 1, limit: 30} // 重新指向分页
        }, true);
    }
    function del(order_id){
        if(order_id){
            var ids = [order_id];
        }else{
            var checkStatus = layui.table.checkStatus('tabledata');
            var data = checkStatus.data;
            var ids = [];
            $.each(data, function(index, value){
                //goods_ids.append(value.goods_id);
                ids.push(value.order_id);
            });
        }
        layer.confirm('确定要删除选择的订单'+ids+'吗？', function(index){
            $.ajax({
                type: "POST",
                url: "{:url('delOrder')}",
                data: {ids:ids},
                success: function(res){
                    console.log(res);
                    if(res.status){
                        layer.msg('提交成功');
                    }else{
                        layer.msg(res.msg);
                    }
                    layer.close(index);
                    tableIns.reload()
                }
            });
            layer.close(index);
            // 向服务端发送删除指令
        });
    }
    //查看详情
    function detail(id){
        var layer_detail = layer.open({
            title: '查看订单 - id:'+ id,
            type: 2,
            shadeClose: true,
            area: ['100%','100%'],
            scrollbar:false,
            content: '/admin/order/detail/id/'+id
        });
    }
    //审核退款
    function auditRefund(order_id){
        var recharge_layer = layer.open({type:1,area:['500px','300px'],title:'审核退款',content:$('#audit_model'),shadeClose:true,btn: ['确定', '取消'],
            yes:function(){
                var index = layer.load();
                var audit_status = $('#audit_status').val();
                if(audit_status==1){
                    //审核通过
                    $.post("{:url('tuihuo_agree')}",{
                        order_id:order_id,
                        reason:$('#audit_remark').val(),
                    },function(res){
                        layer.close(index);
                        dialog(res.msg,res.status);
                        layer.close(recharge_layer);
                        tableIns.reload()
                    })
                }else{
                    //审核拒绝
                    //审核通过
                    $.post("{:url('tuihuo_refuse')}",{
                        order_id:order_id,
                        reason:$('#audit_remark').val(),
                    },function(res){
                        layer.close(index);
                        dialog(res.msg,res.status);
                        layer.close(recharge_layer);
                        tableIns.reload()
                    })
                }

            }
        })
    }
    //关闭订单
    function closeorder(order_id){
        layer.confirm('确定关闭订单'+order_id+'吗？', function(index){
            $.ajax({
                type: "POST",
                url: "{:url('close_order')}",
                data: {order_id:order_id},
                success: function(res){
                    console.log(res);
                    if(res.status){
                        layer.msg('提交成功');
                    }else{
                        layer.msg(res.msg);
                    }
                    layer.close(index);
                    tableIns.reload()
                }
            });
            layer.close(index);
        });
    }
    //订单发货
    function sendorder(order_id){
        var recharge_layer = layer.open({type:1,area:['500px','300px'],title:'物流发货',content:$('#send_model'),shadeClose:true,btn: ['确定', '取消'],
            yes:function(){
                var index = layer.load();
                //审核通过
                $.post("{:url('send')}",{
                    order_id:order_id,
                    shipping_code:$('#shipping_code').val(),
                    delivery_no:$('#delivery_no').val(),
                },function(res){
                    layer.close(index);
                    dialog(res.msg,res.status);
                    layer.close(recharge_layer);
                    tableIns.reload()
                })
            }
        })
    }
    //分配配送员
    function topsuser(order_id){
        var recharge_layer = layer.open({type:1,area:['500px','300px'],title:'分配配送员',content:$('#ps_model'),shadeClose:true,btn: ['确定', '取消'],
            yes:function(){
                var index = layer.load();
                //审核通过
                $.post("{:url('topsuser')}",{
                    order_id:order_id,
                    ps_id:$('#ps_id').val(),
                },function(res){
                    layer.close(index);
                    dialog(res.msg,res.status);
                    layer.close(recharge_layer);
                    tableIns.reload()
                })
            }
        })
    }
    var chooseUserLayer;
    function showChoosPsUser(){
        chooseUserLayer = layer.open({type:2,title:'选择配送员',content:"{:url('PeisongUser/choosepeisonguser')}/args/1",area:['1000px','600px'],shadeClose:true});
    }
    function choosepeisonguser (res,args) {
        console.log(res);
        var detail = res;
        $('#ps_name').html(detail.realname);
        $('#ps_id').val(detail.id);
    }
    //关闭订单
    function confirmorder(order_id){
        layer.confirm('确定要收货订单'+order_id+'吗？', function(index){
            $.ajax({
                type: "POST",
                url: "{:url('order_confirm')}",
                data: {order_id:order_id},
                success: function(res){
                    console.log(res);
                    if(res.status){
                        layer.msg('提交成功');
                    }else{
                        layer.msg(res.msg);
                    }
                    layer.close(index);
                    tableIns.reload()
                }
            });
            layer.close(index);
        });
    }

    function viewExpress(order_id){
        var index = layer.load();
        $.post("{:url('getExpress')}",{order_id:order_id},function(res){
            var expressdata = res.data
            layer.close(index);
            if(res.status){
                layui.laytpl(logisticsTpl.innerHTML).render(res, function(html){
                    var logisticsLayer = layer.open({type:1,title:'查看物流',content:html,area:"800px",shadeClose:true,btn: ['修改', '关闭'],
                        yes:function(){
                            layer.close(logisticsLayer);
                            sendorder(order_id);
                        }
                    })
                })
                return ;
            }else{
                var html = '';
                html+='<div class="orderinfo" style="width:450px;margin-left:20px">';
                html+='	<div class="item">';
                html+='		<span class="t1">错误信息</span>';
                html+='		<span class="t2">'+res.msg+'</span>';
                html+='	</div>';
                html+='</div>';
                var logisticsLayer = layer.open({type:1,area:['500px','650px'],title:false,content:html,shadeClose:true,btn: ['修改', '关闭'],
                    yes:function(){
                        layer.close(logisticsLayer);
                        sendorder(order_id);
                    }
                })
                return ;
            }
        });
    }
</script>
<script id="logisticsTpl" type="text/html">
    <div style="padding:5px"></div>
    {{# if(d.data.length>0){ }}
    <div class="layui-tab layui-tab-brief" lay-filter="mytab">
        <ul class="layui-tab-title">
            <li  class="layui-this">{{d.express_com}}-{{d.express_no}}</li>
        </ul>
        <div class="layui-tab-content">
            {{#  layui.each(d.data, function(index, item){ }}
            <div class="layui-tab-item layui-show">
                <ul class="layui-timeline">
                    <li class="layui-timeline-item">
                        <i class="layui-icon layui-timeline-axis {{index==0?'on':''}}"></i>
                        <div class="layui-timeline-content layui-text">
                            <p>{{item.time}}</p>
                            <p>
                                {{item.context}}
                            </p>
                        </div>
                    </li>
                </ul>
            </div>
            {{# }); }}
        </div>
    </div>
    {{# }else{ }}
    <div style="padding:20px 0 20px 0;font-size:16px">暂未查到物流信息</div>
    {{# } }}
</script>
</body>
</html>